<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css" />
<script src="${pageContext.request.contextPath}/js/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
	<script type="text/javascript">
		let del = (id) => {
			if(confirm("确认删除吗?")){
				$.ajax({
					url:"${pageContext.request.contextPath}/goodstypeservlet?method=deleteType",
					data:{id},
					dataType:"json",
					type:"post",
					success: (resp)=>{
						const {code,msg,data} = resp;
						if(code === 200){
							window.location.href = "${pageContext.request.contextPath}/goodstypeservlet?method=getGoodsType"
						}else{
							alert(msg);
						}
					},
					error: (XMLHttpRequest, textStatus, errorThrown) => {
						alert("失败" + XMLHttpRequest.status + ":" + textStatus + ":" + errorThrown);
					}
				})
			}
		}
	</script>

<title>商品分类</title>
</head>
<body>
<div class="row" style="width:98%;margin-left: 1%;">
	<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
		<div class="panel panel-default">
			<div class="panel-heading">
				商品类型
			</div>
			<div class="panel-body">
				<div class="row">
					<div class="col-xs-5 col-sm-5 col-md-5 col-lg-5">
						<div class="form-group form-inline">
							<span>商品等级</span>
							<input type="text" name="username" class="form-control">
						</div>
					</div>
					<div class="col-xs-5 col-sm-5 col-md-5 col-lg-5">
						<div class="form-group form-inline">
							<span>商品名称</span>
							<input type="text" name="pubdate" class="form-control">
						</div>
					</div>
					<div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">
						<button type="button" class="btn btn-primary" id="search"><span class="glyphicon glyphicon-search"></span></button>
					</div>
				</div>
				<div style="height: 400px;overflow: scroll;">
				<table id="tb_list" class="table table-striped table-hover table-bordered">
					<tr>
						<td>序号</td>
						<td>类型</td>
						<td>等级</td>
						<td>操作</td>
					</tr>
					<c:forEach items="${goodsTypeList}" var="gtype" varStatus="i">
					<tr>
						<td>${i.count}</td>
						<td>${gtype.name}</td>
						<td>${gtype.level}</td>
						<td>
							<button class="btn btn-primary btn-xs" data-toggle="modal" data-target="#myModal${gtype.id}">修改</button>&nbsp;&nbsp;
							<!-- 弹出模态框 -->
							<div class="modal fade" tabindex="-1" role="dialog" id="myModal${gtype.id}">
								<div class="modal-dialog" role="document">
									<div class="modal-content">
										<div class="modal-header">
											<button type="button" class="close" data-dismiss="modal">
												<span>&times;</span>
											</button>
											<h4 class="modal-title">修改类型</h4>
										</div>
										<form action="goodstypeservlet?method=updateType" method="post" class="form-horizontal">
											<div class="motal-body">
												<div class="form-group">
													<label class="col-sm-2 control-label">类型名字</label>
													<div class="col-sm-9">
														<input type="hidden" name="id" value="${gtype.id}">
														<input type="hidden" name="level" value="${gtype.level}">
														<input type="text" name="name" class="form-control" value="${gtype.name}">
													</div>
												</div>
											</div>
											<div class="motal-footer">
												<div class="form-group">
													<label class="col-sm-2 control-label"></label>
													<div class="col-sm-9">
														<button type="submit" class="btn btn-primary">修改</button>
													</div>
												</div>
											</div>
										</form>
									</div>
								</div>
							</div>
							<button class="btn btn-danger btn-xs" onclick="del(${gtype.id})">删除</button>
						</td>
					</tr>
					</c:forEach>
				</table>
				</div>
			</div>
		</div>
	</div>
</div>
</body>
</html>